import { _decorator, Component, Label, Node, Slider, Sprite, tween } from 'cc';
import { back } from './back';
const { ccclass, property } = _decorator;

@ccclass('j6')
export class j6 extends back {
    @property(Node)
    item1:Node;
    @property(Node)
    item2:Node;
    @property(Node)
    item3: Node = null;
    @property(Node)
    item4: Node = null;
    @property(Node)
    s1: Node = null;
    @property(Node)
    s2: Node = null;
    @property(Node)
    s3: Node = null;
    @property(Label)
    l1: Label = null;
    @property(Label)
    l2: Label = null;
    @property(Label)
    l3: Label = null;

    onSliderChange(slider: Slider, val){
        let progressNum = Math.floor(slider.progress*255);
        let prop;
        if(val==='1'){
            this.l1.string = `R:${progressNum}`
            prop = 'r'
        }
        if(val==='2'){
            this.l2.string = `G:${progressNum}`
            prop = 'g'
        }
        if(val==='3'){
            this.l3.string = `B:${progressNum}`
            prop = 'b'
        }
        const spriteComp = this.item1.getComponent(Sprite);
        const color = spriteComp.color;
        // 要克隆一份新颜色，使用原来的 color 变量，引用相同不会改变颜色
        const newColor = color.clone();
        newColor[prop] = progressNum;
        spriteComp.color = newColor;
    }

    start() {
        const spriteComp3 = this.item3.getComponent(Sprite);
        tween(spriteComp3)
            .to(1, { fillStart: 1 })
            .to(1, { fillStart: 0 })
            .union()
            .repeatForever()
            .start();
        
        const spriteComp4 = this.item4.getComponent(Sprite);
        tween(spriteComp4)
            .to(1, { fillRange: 1 })
            .to(1, { fillRange: 0 })
            .to(1, { fillRange: -1 })
            .to(1, { fillRange: 0 })
            .union()
            .repeatForever()
            .start();
    }

    update(deltaTime: number) {
        
    }
}


